import React, { useEffect } from "react";
import Animated, { useSharedValue, useAnimatedStyle, withTiming } from "react-native-reanimated";



export default function AniSlideUp(props) {
  const duration = props.duration || 100;
  const show = props.show;
  const offetY = useSharedValue(1000);
  const animatedStyles = useAnimatedStyle(() => {
    return {
      transform: [{ translateY: offetY.value }],
    };
  });
  useEffect(() => {
    if (show) {
      offetY.value = withTiming(0, { duration: duration });
    } else {
      offetY.value = withTiming(1000, { duration: duration });
    }
  }, [offetY, show, duration]);

  return (<Animated.View
    style={[{
      position: "absolute",
      width: "100%",
      height: "100%",
      bottom: 0,
      ...props.style,
      transform:[{ translateY:0 }],
      zIndex:10
    }, animatedStyles]}
  >
    {props.children}
  </Animated.View>);
}
